<template>
  <div>
    <van-nav-bar
      :z-index="999"
      :fixed="true"
      left-arrow
      @click-left="onClickLeft"
      :placeholder="true"
      title="修改密码"
    ></van-nav-bar>
    <div class="changePhone">
      <van-cell-group>
        <van-field
          v-model="value"
          type="password"
          label="旧密码"
          placeholder="请输入旧密码"
        />
        <van-field
          @focus="focus"
          @blur="blur"
          v-model="password"
          type="password"
          label="新密码"
          placeholder="请输入新密码"
        />
        <van-field
          v-model="identical"
          type="password"
          label="确认密码"
          placeholder="请确认密码"
        />
      </van-cell-group>
      <div v-if="condition" class="reminder">
        密码必须包含字母、数字且长度为8~20字符！
      </div>

      <div @click="amend" class="authcode-btn">确认修改</div>
    </div>
  </div>
</template>

<script>
import { Dialog, Toast } from "vant";
import { alterPasswod } from "../../../assets/js/api/user";
export default {
  name: "changedPassword",
  data() {
    return {
      value: "", // 旧密码
      password: "", // 新密码
      identical: "", // 确认密码
      condition: false
    };
  },

  methods: {
    focus() {
      this.condition = true;
    },
    blur() {
      this.condition = false;
    },

    amend() {
      if (this.value == "") {
        Toast("请输入旧密码");
        return;
      }
      if (this.password == "") {
        Toast("请输入新密码");
        return;
      }
      if (this.identical == "") {
        Toast("请输入确认密码");
        return;
      }

      if (!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/.test(this.password)) {
        Dialog.alert({
          message: "密码格式不对"
          // theme: "round-button"
        }).then(() => {
          // on close
        });
        return;
      }
      // console.log(`密码：${this.password},确认密码${this.identical}`);
      if (!(this.password == this.identical)) {
        Dialog.alert({
          message: "两次密码不一致"
          // theme: "round-button"
        }).then(() => {
          // on close
        });
        return;
      }

      if (this.value == this.password) {
        Toast.fail("原密码不能与新密码不能一致");
        return;
      }

      let obj = {
        oldpwd: this.value,
        newpwd: this.password
      };
      alterPasswod(obj).then(res => {
        // console.log(obj);
        // console.log(res);
        if (res.code == 0) {
          Dialog.alert({
            message: "修改成功，请重新登录"
            // theme: "round-button"
          }).then(() => {
            localStorage.removeItem("token");
            sessionStorage.removeItem("token");
            localStorage.removeItem("img");
            localStorage.removeItem("userName");
            this.$router.push({ name: "AuthCode" });
          });
        } else {
          Dialog.alert({
            message: res.msg
            // theme: "round-button"
          }).then(() => {});
        }
      });
    },

    onClickLeft() {
      this.$router.go(-1);
    }
  },
  components: { [Dialog.Component.name]: Dialog.Component },
  created() {
    let dsBridge = require("dsbridge");
    dsBridge.call("goBack", "", function() {
      history.go(-1);
    });
  }
};
</script>

<style></style>
